<div class="article">
    <h3 class="title">categories</h3>
    <ul class="categories">
    <%
        var cMap = {};
        for(post in posts){
            if(cMap[post.categories] == null){
                cMap[post.categories] = [post];
            }else{
                cMap[post.categories] = array.add(cMap[post.categories],post);
            }
        }
    %>
    <% for( category in cMap){ %>
        <li class="categories-item"><a href="#${ category.key }-ref">
            ${category.key}
        </a></li>
    <%  }  %>
    </ul>

<div class="article">
<% for( category in cMap){ %>
  <h2  class="article-year" id="${ category.key }-ref" data-year="&diams;">${category.key}</h2>
  <ul style="list-style: none">
    <% var pages_list = category.value; %>
    <% for( node in pages_list){ %>
      <% if(node.title! != null){ %>
            <li style="background:#F2EEEC; padding:5px; margin:3px 0"><a href="${node.path}">${node.title}</a></li>
      <%  }  %>
    <%  }  %>

  </ul>
<%  }  %>
</div>
</div>
